<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>LifeInClass - Online School Managament System</title>

    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/navbar-static-top.css" rel="stylesheet">
   

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

    <!-- Custom styles for this template -->

    <link href="css/carousel.css" rel="stylesheet">
    <style type="text/css">
      .head-tabs{
        color:#fff;
        font-weight: bold;
      }
    </style>
  </head>



<body style="padding-bottom:0;">

<!-- ============   Navigation-static-top navbar (HOME PAGE HEADER)  ============== -->

<nav class="navbar navbar-default navbar-static-top" role="navigation" style="background: #a8cf45; padding:0% 12%;">
  <div class="container">
    <div class="navbar-header">
      <a href="index.html"><img width="250px" src="images/logo1.png" style="margin-top:30px"></a>
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar" >
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
    </div>
    <div id="navbar" class="navbar-collapse collapse" style="margin-top:30px;">
      <ul class="nav navbar-nav pull-right" style="margin-right:12%; margin-bottom:2%;">
        <li><a href="#home" class="head-tabs" data-toggle="tab"><font size="4">Home</font></a></li>
        <li><a href="#features" class="head-tabs" data-toggle="tab"><font size="4">Features</font></a></li>
        <li><a href="#about" class="head-tabs" data-toggle="tab"><font size="4">About</font></a></li>
        <li><a href="#contact" class="head-tabs" data-toggle="tab"><font size="4">Contact</font></a></li>
        <li><a href="#signup" class="head-tabs" data-toggle="tab"><font size="4">Sign Up</font></a></li>
        <li><a href="#login" class="head-tabs" data-toggle="tab"><font size="4">Login</font></a></li>
      </ul>
    </div>
  </div>
</nav>

<!-- ============   END of Navigation-static-top navbar (HOME PAGE HEADER)  ============== -->






<!-- =====================================  Page Start  ======================================== -->

<div class="tab-content" style="margin-top: 6%">
  <div role="tabpanel" class="tab-pane active" id="home">
        

<!-- =====================================   Carousel  =================================== --> 

     <!-- <div id="myCarousel" class="carousel slide" data-ride="carousel" style="margin-bottom:0"> -->

          <!-- Indicators -->

     <!-- <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
          </ol>
          <div class="carousel-inner" role="listbox">
            <div class="item active">
              <img src="images/slide-01.jpg" alt="First slide">
            </div>
          </div>
          <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
            <span class="sr-only">Previous</span>
          </a>
          <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
            <span class="sr-only">Next</span>
          </a>
        </div> --> 

<!-- ================================   END of Carousel  ============================== -->

<!-- ============   First Container (LifeInClass is giving you & image)  ============== -->

        <!-- Wrap the rest of the page in another container to center all the content. -->

        <div class="container" style="padding:0% 5%">
          <div class="row" style="margin: auto;width:100%; margin-top:-3%;">
            <h3 style="text-align:center; font-family:New Century Schoolbook, serif; font-size:40px; margin-top:-10px; line-height:normal;  color:rgb(136, 136, 136); font-weight:100;">LifeInClass Is The Simple, Secure Online School Management System.
            </h3> 
            <div class="col-lg-6" style="margin-top:1%">
                <img style="width: 100%" src="images/Lifeinclassisgivingyou.png" >
            </div>
          </div><br/>
          <div class="row" style="margin: auto;width:100%">
            <div class="col-lg-5">
              <ul id="hero-bullets" class="dropdown-menu-no-collapse" style="font-weight: bold; font-size:18px;">
                 <li style="margin-bottom: 10px;">LifeInClass is cloud-based. Where in teachers, administrators & parents can simultaneously access data in real time.</li>
                 <li style="margin-bottom: 10px;">Teachers, Administratos & Parents can access the data anytime from anywhere.</li>
                 <li style="margin-bottom: 10px;">The school does not have to invest in any  hardware.</li>
                 <li style="margin-bottom: 10px;">No software to install and maintain. All we need is a web browser.</li>
                 <li style="margin-bottom: 10px;">LifeInClass is clean, beautiful & easy to use interface.</li>
                <br/>
              </ul>
            </div>
            <div class="col-lg-6" style="float: right;" >
              <img width="100%" src="images/home_page_kid.png" style="margin-top:-40px">
            </div>
          </div>
        </div>

<!-- ============   END of First Container (LifeInClass is giving you & image)  ============== -->

<!-- ==============================   Second Container :- Features ============================= -->

      <div class="container marketing" style="padding:0% 6%">
        <br/>
        <h3 style="text-align:center; font-family:New Century Schoolbook, serif; font-size:40px; margin-top:-10px; line-height:normal;  color:rgb(136, 136, 136); font-weight:100;">Features
            </h3>
        
          <!-- Three columns of text below the carousel -->
          <div class="row">
            <div class="col-lg-4">
              <img src="images/board1.png" width="90%">
            </div><!-- /.col-lg-4 -->
            <div class="col-lg-4">
              <img src="images/board2.png" width="90%">
            </div><!-- /.col-lg-4 -->
            <div class="col-lg-4">
              <img src="images/board3.png" width="90%">
            </div><!-- /.col-lg-4 -->
          </div><!-- /.row -->
          <div class="row">
            <div class="col-lg-4">
              <img src="images/board4.png" width="90%">
            </div><!-- /.col-lg-4 -->
            <div class="col-lg-4">
              <img src="images/board5.png" width="90%">
            </div><!-- /.col-lg-4 -->
            <div class="col-lg-4">
              <img src="images/board6.png" width="90%">
            </div><!-- /.col-lg-4 -->
          </div><!-- /.row -->
          

<!-- ============================   End of Second Container :- Features   ====================== -->

<!-- ========================   Third Container :- What they're saying   ======================= -->

          <br/>
          <h3 style="text-align:center; font-family:New Century Schoolbook, serif; font-size:40px; margin-top:-10px; line-height:normal;  color:rgb(136, 136, 136); font-weight:100;">What They're Saying
            </h3>
          <div>
            <div style="margin: 10px 0px">
              <img src="images/quote1.png" width="50px">
              <img src="images/schoolbag.png" width="50px" style="float:right">
            </div>
            <div class="well">
              No reviews yet from school.
            </div>
            <div style="margin: 10px 0px">
              <img src="images/quote2.png" width="50px">
              <img src="images/schoolbook.png" width="50px" style="float:right">
            </div>
            <div class="well">
              No reviews yet from school.
            </div>
            <div style="margin: 10px 0px">
              <img src="images/quote3.png" width="50px">
              <img src="images/schoolbrush.png" width="50px" style="float:right">
            </div>
            <div class="well">
              No reviews yet from school.
            </div>
          </div>
        </div><!-- /.container -->

<!-- ========================   End of Third Container :- What they're saying   ====================== -->

</div><!-- End of home tab-panel-->

<!-- ====================================  Page End  ===================================== -->







<!-- ================================   Features  ================================= -->

<div role="tabpanel" class="tab-pane" id="features">
  <img width="280px" height="300px"src="images/sidetp.png" style="margin-top:-100px;">
  <div class="container" style="padding:0% 6%">
  <h2 style="text-align:center; font-family:New Century Schoolbook, serif; font-size:40px; margin-top:-210px; line-height:normal;  color:rgb( 136, 136, 136); font-weight:100;">Features
  </h2> 
    <ol>

      <li style="font-weight: bold; font-size:22px;"><h4 style="font-weight: bold; font-size:22px;"> Attendance <img src="images/att.png" width="50px"></h4>
      </li>
      <h4><p>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Attendance is the key task for teachers. Taking attendance in traditional way is time comsuming and  maintaining is difficult. Now it is easy to take attendance and notify parents immediately about the same throught lifeinclass.com via E-mails and text messages to parents cell phones.
      </p></h4>

      <li style="font-weight: bold; font-size:22px;"><h4 style="font-weight: bold; font-size:22px;"> Student Information <img src="images/sinfo.png" width="50px"></h4>
      </li>
      <h4><p>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Student information includes basic information such as address, grades, parents, and contact information. During the school year teachers enter the information about their students such as grades, attendance, complaints, discipline, and achievements into the same electronic file so that a student’s records are always complete and up to date.
      </p></h4> 

      <li style="font-weight: bold; font-size:22px;"><h4 style="font-weight: bold; font-size:22px;"> Teacher Information <img src="images/tinfo.png" width="50px"></h4>
      </li>
      <h4><p>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Teachers basic information such as name, qualification, contact details etc can be maintained and managed online through lifeinclass.com.
      </p></h4> 

      <li style="font-weight: bold; font-size:22px;"><h4 style="font-weight: bold; font-size:22px;"> Parent Access <img src="images/pacc.png" width="50px"></h4>
      </li>
      <h4><p>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Parents are given with the login details, they can track their childs attendance, grades, remarks, complaints, sports and track overall performance in the academic year. Parents can also communicate with teachers for futher assistance.
      </p></h4>  

      <li style="font-weight: bold; font-size:22px;"><h4 style="font-weight: bold; font-size:22px;"> Upcoming Events <img src="images/cal.png" width="50px"></h4>
      </li>
      <h4><p>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Parents and students can be updated with upcoming events in the school and class. Parents and teachers can keep track of the events that are taking place in the premises by monitoring the schedule through lifeinclass.com.
      </p></h4> 

      <li style="font-weight: bold; font-size:22px;"><h4 style="font-weight: bold; font-size:22px;"> Email & Text Messaging <img src="images/text.png" width="50px"></h4>
      </li>
      <h4><p>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Teachers can send E-mail and/Or text message to the parents for absentees. Also teachers can notify parents about the events and programs through Email and messaging with lifeinclass.com easy to access interface and within no time parents will be notified of the same.
      </p></h4>  
      <br/>

    </ol>
  </div> 
</div>

<!-- ================================   Features End  ============================= -->

<!-- ===================================   About  ================================= -->


  <div role="tabpanel" class="tab-pane" id="about">
    <img width="280px" height="300px"src="images/sidetp.png" style="margin-top:-100px;">
    <div class="container" style="padding:0% 6%">
    <h2 style="text-align:center; font-family:New Century Schoolbook, serif; font-size:40px; margin-top:-210px; line-height:normal;  color:rgb(136, 136, 136); font-weight:100;">About Us
    </h2> 
      <div class="row" style="margin: auto;width:100%">
        <div class="col-lg-5">
              
        </div>
        <div class="col-lg-6" style="float: right;" >
          <img width="300px" height="350px" style="float:right; margin-top:2%;" src="images/contactus.png">
        </div>
      </div>
    </div> 
  </div>

<!-- ================================   About End  ================================= -->

<!-- ===================================  Contact  ================================= -->


  <div role="tabpanel" class="tab-pane" id="contact">
    <img width="280px" height="300px"src="images/sidetp.png" style="margin-top:-100px;">
      <div class="container" style="padding:0% 6%">
        <h2 style="text-align:center; font-family:New Century Schoolbook, serif; font-size:40px; margin-top:-210px; line-height:normal;  color:rgb(136, 136, 136); font-weight:100;">Contact Us
        </h2> 
        <h4 style="font-weight: bold; margin-top:3%; font-size:18px;">Thank you for your interest in LifeInClass.com. If you have any queries about<br/>  LifeInClass...</h4>
        <p>Just fill out your details in the form below and we'll get back to you as soon as possible.</p>

          
          <div class="row" style="margin: auto;width:100%">
            <div class="col-lg-5">
              <p>Enter your name:</p>
              <input type="text" class="form-control" placeholder="Your name" id="contact_name">
              <br/>
              <p>Enter your school name:</p>
              <input type="text" class="form-control" placeholder="Your school name" id="contact_school">
              <br/>
              <p>Enter your e-mail:</p>
              <input type="text" class="form-control" placeholder="Your Email" id="contact_email">
              <br/>
              <p>Enter your contact:</p>
              <input type="text" class="form-control" placeholder="Your contact" id="contact_contact">
              <br/>
              <p>Enter your city:</p>
              <input type="text" class="form-control" placeholder="Your city" id="contact_city">
              <br/>
              <p>Enter your state:</p>
              <input type="text" class="form-control" placeholder="Your state" id="contact_state">
              <br/>
              <p>Subject:</p>
              <input type="text" class="form-control" placeholder="Your Subject" id="contact_subject">
              <br/>
              <p>Message:</p>
              <div class="input-group">
                  <textarea class="form-control custom-control" rows="3" style="resize:none" id="contact_message"></textarea> 
              
              </div>
              <br/>
              <br/>
              <button class="btn btn-primary btn-lg" style="width: 50%;margin: auto;font-weight: bold;" onclick="contactUs();">Submit</button>
              <br/>
              <br/>
            </div>
            <div class="col-lg-6" style="float: right;" >
              <img width="300px" height="350px" style="float:right; margin-top:2%;" src="images/contactus.png">
            </div>
          </div>
      </div> 
  </div>

<!-- ===============================   Contact End   =============================== -->


<!-- =================================   Sign Up  ================================== -->

  <div role="tabpanel" class="tab-pane" id="signup">
    <div class="container marketing" style="margin-top: 70px; margin-top:-5%;">
    <h2 style="text-align:center; font-family:New Century Schoolbook, serif; font-size:40px; line-height:normal;  color:rgb(136, 136, 136); font-weight:100;">Sign Up For Free Now</h2>
      <div class="container" style="margin-left:-1%; width:100%;padding: 0% 13%">
        <div style="width: 100%;margin: 30px 10px 0px 10px" class="row">
          <div class="col-lg-6">
            <p>Enter your school name:</p>
          </div>
          <div class="col-lg-6">
            <p>Enter your name:</p>
          </div>
        </div>
        <div style="width: 100%;margin: 0px 10px 0px 10px" class="row">
          <div class="col-lg-6">
            <input type="text" class="form-control" placeholder="Your schools name" id="signup_school">
          </div>
          <div class="col-lg-6">
            <input type="text" class="form-control" placeholder="Your name" id="signup_name">
          </div>
        </div>
            <div style="width: 100%;margin: 30px 10px 0px 10px" class="row">
              <div class="col-lg-6">
                <p>Enter E-mail id:</p>
              </div>
              <div class="col-lg-6">
                <p>Enter phone number:</p>
              </div>
            </div>
            <div style="width: 100%;margin: 0px 10px 0px 10px" class="row">
              <div class="col-lg-6">
                <input type="text" class="form-control" placeholder="E-mail ID" id="signup_email">
              </div>
              <div class="col-lg-6">
                <input type="text" class="form-control" placeholder="Phone number" id="signup_phone">
              </div>
            </div>
            <div style="width: 100%;margin: 30px 10px 0px 10px" class="row">
            <div class="col-lg-6">
              <p>Enter your state:</p>
            </div>
            <div class="col-lg-6">
              <p>Enter your city:</p>
            </div>
            </div>
            <div style="width: 100%;margin: 0px 10px 0px 10px" class="row">
              <div class="col-lg-6">
                <input type="text" class="form-control" placeholder="Your state" id="signup_state">
              </div>
              <div class="col-lg-6">
                <input type="text" class="form-control" placeholder="Your city" id="signup_city">
              </div>
            </div>
            <div style="width: 100%;margin: 30px 10px 0px 10px" class="row">
              <div class="col-lg-6">
                <p>Enter your password:</p>
              </div>
              <div class="col-lg-6">
                <p>Confirm your password:</p>
              </div>
            </div>
            <div style="width: 100%;margin: 0px 10px 0px 10px" class="row">          
              <div class="col-lg-6">
                <input type="password" class="form-control" placeholder="Password" id="signup_passwd">
              </div>
              <div class="col-lg-6">
                <input type="password" class="form-control" placeholder="Confirm Password" id="signup_confpasswd">
              </div>
            </div>
            <div style="width: 100%;margin: 20px 10px" class="row">
              <div style="margin:auto;width: 50%">
                <button class="btn btn-primary btn-lg" style="width: 100%;margin: auto;font-weight: bold;" onclick="sinup();">Sign Up</button>
              </div>
            </div>
          </div>
        </div>
      </div>

<!-- ================================   END of Sign Up  =============================== -->

<!-- ================================   Login  =============================== -->

<div role="tabpanel" class="tab-pane" id="login" style="margin-top:0%">
    <div class="container marketing" style="margin-top: 70px; margin-top:-5%;">

    <div class="container" style="padding:0% 5%">
          <div class="row" style="margin-left:12%;">
                    <div class="col-lg-6">
                      <h3 style="font-family:New Century Schoolbook, serif; font-size:40px; margin-top:0%; margin-right:-10%; line-height:normal;  color:rgb(136, 136, 136); font-weight:100;">Parent Login
                      </h3>   
 
                      <div style="width: 100%;margin: 0px 10px 10px 0px" class="row" >
                        <div class="col-lg-6" style="margin-left:2%;">                      
                          <input type="text" class="form-control" placeholder="E-mail Id" id="parentlogin_email">
                          <br/>
                          <input type="password" class="form-control" placeholder="Password" id="parentlogin_pwd">
                          <br/>
                          <button class="btn btn-primary btn-lg" style="width: 40%;margin: auto;font-weight: bold;" onclick="parentlogin();">Login</button>
                        </div>
                      </div>
                    </div>
                    <br/>

                    <div class="col-lg-6" style="margin-top:-2%;">
                      <h3 style="font-family:New Century Schoolbook, serif; font-size:40px; margin-top:0%; line-height:normal;  color:rgb(136, 136, 136); font-weight:100;">School Login
                      </h3>   

                      <div style="width: 100%;margin: 0px 10px 10px 0px" class="row" >
                        <div class="col-lg-6" style="margin-left:2%;">                      
                          <input type="text" class="form-control" placeholder="E-mail Id" id="schoollogin_email">
                          <br/>
                          <input type="password" class="form-control" placeholder="Password" id="schoollogin_pwd">
						  <br/>
						  <a id="forgotPwdSchoolLogin" href="#" style="text-decoration:none">Forgot Password ?</a>
						  <br/>
                          <button class="btn btn-primary btn-lg" style="width: 40%;margin: auto;font-weight: bold;" onclick="schoollogin();">Login</button>
					   </div>
                      </div>
                    </div>
                </div>
    </div>


    </div>
</div>

</div><!-- Tab panel home closing div -->

<!-- ================================   END of Login  =============================== -->

<!-- ============================   Upper Footer   ========================= -->

<div class="row-fluid" style="padding:0% 10%; background: #eeeee0">
  <div class="container" style="margin-left:-4%">
    <div class="row">
      <br>
      <div class="col-xs-6 col-sm-3" style="text-align:center;">
        <font size="2" face="Arial" color="black"><b>ABOUT LIFEINCLASS</b></font>
        <ul style="list-style: none; color:CadetBlue; margin-right:40px;">
          <li>A Word From Us</a><li>   
          <li>Contact Us<li>
        </ul>
      </div>

      <div class="col-xs-6 col-sm-3" style="text-align:center;">
        <font size="2" face="Arial" color="black"><b>FEATURES</b></font>
        <ul style="list-style: none; color:CadetBlue; margin-right:40px;">
          <li>Attendance<li>   
          <li>Student Information<li>
          <li>Teacher Information<li>
          <li>Parent Access<li>
          <li>Email & Text Messaging <li>
          <li>Upcoming Events Etc<li>
        </ul>
      </div>
   

  <!-- Add the extra clearfix for only the required viewport -->
  <div class="clearfix visible-xs-block"></div>

      <div class="col-xs-6 col-sm-3" style="text-align:center;">
        <font size="2" face="Arial" color="black"><b>WHY LIFEINCLASS?</b></font>
        <ul style="list-style: none; color:CadetBlue; margin-right:40px;">
          <li>Simple<li>   
          <li>Powerfull<li>
          <li>Integrated<li>
          <li>Affordable<li>
          <li>Fully Online<li>
        </ul>
      </div>

      <div class="col-xs-6 col-sm-3" style="text-align:center;">
        <font size="2" face="Arial" color="black"><b>CONNECT WITH US</b></font>
        <ul style="list-style: none; color:CadetBlue; margin-right:40px;">
          <li>Facebook<li>
          <li>Twitter<li>
          <li>Google Plus<li>   
        </ul>
      </div>

    </div>
    <br>
  </div>
</div>

<!-- ========================   End Of Upper Footer   ====================== -->



 <!-- ============================   Footer  =========================== -->

    
  <div class="footer" style="background-color: #a8cf45; padding:0% 12%;">
    <div class="container">
      <div class="navbar-header">
        <a href="index.html"><img width="250px" src="images/logo1.png" style="margin-top:30px"></a>
        <font size="1"><P>Copyright 2014-15. All rights reserved</P></font>
      </div>
      <div id="navbar" style="margin-top:40px;">
        <ul class="navbar-nav pull-right" style="margin-right:20%; margin-bottom:2%; list-style:none;">
          <li><a href="privacy.html">Privacy Policy</a>&nbsp&nbsp&nbsp</li>
          <li><a href="terms.html">Terms and Conditions</a>&nbsp&nbsp&nbsp</li>
        </ul>
      </div>
    </div>
  </div>
  

<div class="modal fade" id="alertModal">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-body">
				<p id="alertMsg"></p>
			</div>
		</div>
	</div>
</div>


<!-- ============================   END of Footer  =========================== -->


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery-1.11.1.min.js"></script>
	<script src="js/jquery.cookie.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/index.js"></script>
    <script src="js/login.js"></script>
    <script src="js/ie-emulation-modes-warning.js"></script>
  </body>
</html> 
